import React , { Component } from "react";

import HKBall from '../BallStyle/HKBall';
import GDKLSFBall from "../BallStyle/GDKLSFBall";
import Pk10Ball from "../BallStyle/Pk10Ball";
import SSCBall from "../BallStyle/SSCBall";
export default class OpenStyle extends Component{
  
  ballstyle(num){
    const {gameCode} = this.props;
    switch(gameCode){
      case "CQSSC":
      return  <SSCBall num={num}></SSCBall>
      case "HK6":
      return <HKBall num={num} />
      case "XJSSC":
      return  <SSCBall num={num}></SSCBall>
      case "GDKLSF":
      return  <GDKLSFBall num={num}></GDKLSFBall>
      case "BJPK10":
      return  <Pk10Ball num={num}></Pk10Ball>
      case "MLAFT":
      return  <Pk10Ball num={num}></Pk10Ball>
      case "SC2F":
      return  <Pk10Ball num={num}></Pk10Ball>
    }
  }
  render(){
    let code = this.props.code;
    if(!code){
      code = "";
    }
    let code_1 = [],code_2 = [];
    code_1 = code.split(",");
    code_2 = code_1[code_1.length-1].split("+");
    var _this = this;
    return(
      <div className="circle open-marksix">
        <ul className={this.props.gameCode=="BJPK10" || this.props.gameCode=="MLAFT" || this.props.gameCode=="SC2F" ? "bjpk10" : ""}>
          {code_1.map(function(item,index){
            return(
              <li key={index}>{
                _this.ballstyle(parseInt(item))
              }</li>
            )
          })}
          {
            code_2.length>1 ?
            <div>
            <li className="add-icon">+</li><li><HKBall num={parseInt(code_2[1])} /></li>
            </div>
            : ""
          }
        </ul>
      </div>
    )
  }
  
}